<template>
  <a-sub-menu :key="menuInfo.path" v-if="check(menuInfo.meta.permissions)">
    <template #icon>
      <component :is="menuInfo.meta.icon"></component>
    </template>
    <template #title>{{ menuInfo.meta.title }}</template>
    <template v-for="item in menuInfo.children" :key="item.path">
      <template v-if="!item.children">
        <RouterLink :to="item.path">
          <a-menu-item :key="item.path">
            <template #icon>
              <component :is="item.meta.icon"></component>
            </template>
            {{ item.meta.title }}
          </a-menu-item>
        </RouterLink>
      </template>
      <template v-else>
        <sub-menu :menu-info="item" :key="item.path" />
      </template>
    </template>
  </a-sub-menu>
</template>

<script setup>
  import { check } from '@/utils/auth.js'
  defineProps({
    menuInfo: {
      type: Object
    }
  })
</script>

<style lang="less" scoped>

</style>
